<template>
	<div>
		<van-tabbar style="position: absolute;" v-model="activeBar" active-color="#0FBBA6" inactive-color="#999" @change="onChangeBar">
			<van-tabbar-item icon="home-o">标签</van-tabbar-item>
  		<van-tabbar-item icon="search" dot>标签</van-tabbar-item>
			<!-- <van-tabbar-item>
				<span>我的</span>
				<template #icon="props">
					<img :src="props.active ? myIcon.active : myIcon.inactive" alt="" style="width:22px;height:22px" />
				</template>
			</van-tabbar-item> -->
		</van-tabbar>
	</div>
</template>

<script>
import { isWeiXin, isIos } from '@utils'
export default {
	data() {
		return {
			inWeixin: isWeiXin(),    // 微信环境
			activeBar: 0,
			// myIcon: {
			// 	active: require("@img/icon_myactive.png"),
			// 	inactive: require("@img/icon_my.png"),
			// },
		}
	},

	mounted() {
		if (isIos) { // 解决ios location.href 后 返回页面底部tabbar问题
			window.onpageshow = function (e) {
				if (e.persisted || (window.performance && window.performance.navigation.type == 2)) {
					window.location.reload()
				}
			}
		}
	},
	methods: {
		
		onChangeBar(index) {
			switch (index) {
				case 0:
					this.$router.push("/")
					break
				case 3:
					this.$router.push("/my")
					break
			}
		}
	}
}
</script>

<style lang="less" scoped>
.van-tabbar-item--active span {
	font-weight: bold;
}
</style>
